﻿@{ ViewBag.Title = "Unitech后台管理系统 - 登录";
    Layout = "~/Views/Shared/_Layout.cshtml"; }
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment HostingEnvironment
@section header{
    <link href='@Url.Content("~/yisha/css/login.css")' rel="stylesheet" />
    <script>
        if (window.top !== window.self) { window.top.location = window.location };
    </script>
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/jquery.validation/1.14.0/jquery.validate.min.js"))
}
<div class="login-panel">
    <div class="row section">
        <div class="col-sm-12">
            <form id="form">
                <h4 class="no-margin">登录：</h4>
                <p class="m-t-md">此情可待成追忆，只是当时已惘然</p>
                <p>用户名：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;密码：</p>
                <input id="userName" name="userName" class="form-control uname" col="UserName" type="text" placeholder="用户名" value="@ViewBag.UserName" />
                <input id="password" name="password" class="form-control pword m-b" col="Password" type="password" placeholder="密码" value="@ViewBag.Password" />
                <div class="row">
                    <div class="col-xs-6">
                        <input id="captchaCode" name="captchaCode" type="text" col="CaptchaCode" class="form-control code" placeholder="验证码" maxlength="3">
                    </div>
                    <div class="col-xs-6">
                        <a href="javascript:void(0);" title="点击更换验证码">
                            <img id="imgCaptchaCode" src='@Url.Content("~/Home/GetCaptchaImage")' height="34" />
                        </a>
                    </div>
                </div>
                <div class="checkbox-custom">
                    <input id="rememberMe" name="rememberMe" type="checkbox"> <label for="rememberMe">记住我</label>
                </div>
                <button class="btn btn-success btn-block" onclick="loginForm(); return false;">登录</button>
            </form>
        </div>
    </div>
    <div class="login-footer">
        @*<div style="text-align:center">
                &copy; 2018-@DateTime.Now.Year <a href="#" target="_blank" style="color:white"></a> All Rights Reserved.<br>
                <a href="http://www.beian.miit.gov.cn/" target="_blank" rel="nofollow"></a><br>
            </div>*@
    </div>
</div>
<script type="text/javascript">
    $(function () {
        if ($.cookie('RememberMe') == 1) {
            $("#rememberMe").prop("checked", true);
            if ("@GlobalContext.SystemConfig.LoginProvider" == "Cookie") {
                if (!ys.isNullOrEmpty($.cookie('UserToken'))) {
                    redirectToIndex();
                }
            }
            else {
                $.removeCookie("UserToken", { path: '/' });
            }
        }
        $("#rememberMe").click(function () {
            if ($(this).prop("checked")) {
                $.cookie('RememberMe', 1, { expires: 30, path: '/' });
            }
        });

        //这段代码使用了 jQuery 选择器 $("#imgCaptchaCode") ，它会选中具有 id 属性为 imgCaptchaCode 的 HTML 元素
        //在前端开发中，通过设置元素的 src 属性来发起请求，一般是针对获取静态资源（如图片、视频等）或者动态生成内容（如验证码、图表等）。
        //这种方式通常适用于获取非敏感数据，而不需要通过复杂的 AJAX 请求来实现。
        $("#imgCaptchaCode").click(function () {
            //这里的 $(this) 指代被点击的 #imgCaptchaCode 元素
            // 艾特Url.Content("~/Home/GetCaptchaImage")'：在 ASP.NET MVC 或 ASP.NET Core MVC 中，
            // 艾特Url.Content() 是 Razor 语法，用于生成一个相对 URL 的绝对路径。这里生成的路径是 ~/Home/GetCaptchaImage，表示要获取验证码图片的路径
            //.attr("src", ...) 是 jQuery 的方法，用于设置或获取元素的属性。
            //通过添加一个查询参数 ?t= 后接当前时间戳 new Date().getTime()，每次点击都会生成一个不同的 URL。避免浏览器缓存
            $(this).attr("src", '@Url.Content("~/Home/GetCaptchaImage")' + '?t=' + new Date().getTime());
        });

        //使用 jQuery Validation 插件来验证表单。你的代码片段中定义了验证规则，确保 userName 和 password 字段不能为空。
        $("#form").validate({
            rules: {

                //userName 和 password 是表单字段的名称（或者 ID），用来定义它们的验证规则。
                //required: true 是 jQuery Validation 插件提供的验证规则之一，用于确保字段不能为空。
                userName: { required: true },
                password: { required: true }
            }
        });

        //使用了 jQuery Validation 插件的 setDefaults 方法来设置默认的验证行为
        //$.validator 是 jQuery Validation 插件的命名空间
        //setDefaults() 方法用于设置插件的默认选项或行为。
        //作用：当表单通过验证后，如果设置了 submitHandler，则会执行这个回调函数，
        $.validator.setDefaults({
            //submitHandler 是在验证通过并准备提交表单时触发的一个回调函数。
            //匿名函数 function () { loginForm(); } 是 submitHandler 的回调函数。
            submitHandler: function () {
                loginForm(); //loginForm() 是一个自定义函数，用于处理表单提交的逻辑。
            }
        });
    });

    function loginForm() {
        if ($("#form").validate().form()) {
            var postData = $("#form").getWebControls();
            ys.ajax({
                url: '@Url.Content("~/Home/Login")',
                type: "post",
                data: postData,
                success: function (obj) {
                    if (obj.Tag == 1) {
                        ys.msgSuccess(obj.Message);
                        redirectToIndex();
                    }
                    else {
                        ys.msgError(obj.Message);
                    }
                }
            });
        }
    }

    function redirectToIndex() {
        //url重定向
        location.href = '@Url.Content("~/Home/Index")';
    }
</script>